<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>高德导航到谷歌kml路径生成</title>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.4&key=668a4141ef1959550bc985edd6a048f9&plugin=AMap.MouseTool,AMap.Geocoder,AMap.Autocomplete,AMap.PlaceSearch"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
    <style>
        .context_menu {
            margin: 2px;
            padding: 2px;
            list-style-type: none;
            position: relative;
            background-color: rgb(255, 255, 255);
            border: 1px solid rgb(175, 175, 175);
            border-radius: 5px;
            box-shadow: rgb(153, 153, 153) 2px 2px 8px;
            white-space: nowrap;
            cursor: pointer;
        }
        .context_menu li {
            text-indent: 0.5em;
            color: blue;
            font-size: 13px;
            font-family: verdana;
            height: 20px;
            line-height: 20px;
            word-break: break-all;
            white-space: nowrap;
        }
        .context_menu li.split_line {
            border-bottom-color: rgb(204, 204, 204);
            border-bottom-style: solid;
            border-bottom-width: 1px;
        }
    </style>
</head>
<body>
<div id="container"></div>
<div id="tip">
    <input id="tipinput" placeholder="搜索地址"/><br/>
    <input type="button" class="button" value="下载" title="下载kml路径文件。下载功能需要用谷歌/火狐/极速模式浏览器打开。" onClick="doit()"/>
    <input type="button" class="button" value="反向" title="反转起点和终点" onClick="revert()"/>
    <input type="button" style="display:none" class="button" value="路径" onClick="drawNavi()"/>
    <div>右键可选点，拖动可改路径。<br/>技术支持QQ44636712</div>
    <div style="display: none">
        <span id="result1"></span>
        <span id="result2"></span>
    </div>
</div>
<script type="text/javascript">
    var map, route, marker;
    var points = [];
    var marker_start, marker_end;
    var marker_start_addr, marker_end_addr;

    //基本地图加载
    map = new AMap.Map("container", {
        resizeEnable: true
    });

    marker_start = new AMap.Marker({
        map: map,
        icon: 'http://webapi.amap.com/theme/v1.3/markers/n/start.png',
        position:  [109.41142,24.391471]//基点位置
    });

    marker_end = new AMap.Marker({
        map: map,
        icon: 'http://webapi.amap.com/theme/v1.3/markers/n/end.png',
        position: [109.41142,24.291471] //基点位置
    });


    drawNavi(); //先执行一次

    function revert(){
        //交换坐标
        var marker_start_pos = marker_start.getPosition();
        var marker_end_pos   = marker_end.getPosition();
        marker_start.setPosition(marker_end_pos);
        marker_end.setPosition(marker_start_pos);
        //设置图标
        marker_start.setIcon('http://webapi.amap.com/theme/v1.3/markers/n/end.png');
        marker_end.setIcon('http://webapi.amap.com/theme/v1.3/markers/n/start.png');

        drawNavi();
    }

    function drawNavi(){
        if(typeof route == 'object'){
            route.destroy();
        }
        //导航
        var path = [];
        path.push(marker_start.getPosition());
        path.push(marker_end.getPosition());
        map.plugin("AMap.DragRoute", function() {
            route = new AMap.DragRoute(map, path, AMap.DrivingPolicy.LEAST_TIME); //构造拖拽导航类 http://lbs.amap.com/api/javascript-api/reference/route-search#m_AMap.Driving
            route.search(); //查询导航路径并开启拖拽导航
        });
        getAddr(marker_start.getPosition(),'result1');
        getAddr(marker_end.getPosition(),'result2');
    }

    function doit(){
        points = [];
        route.va.forEach(function (point, index) {
            //console.log(value,index);  // P小O大
            var x,y;
            var threshold = 0.000000001;
            var pos = GPS.gcj_decrypt_exact(point.P,point.O);
            var pOne = '' + pos['lon'] + ',' + pos['lat'] + ',10' ;
            points.push(pOne);
        });
        var pointsStr = points.join(' ');
        //console.log(pointsStr);

        xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
        xhr.open("GET", "kmlTemplet.kml", false);
        xhr.send(null);
        xmlDoc = xhr.responseXML;
        var r1 = document.getElementById('result1').innerHTML;
        var r2 = document.getElementById('result2').innerHTML;
        var fname = r1 + '-到-' + r2;
        xmlDoc.getElementById('route_name').innerHTML = fname;
        //xmlDoc.getElementById('route_points_str').innerHTML = pointsStr;
        xmlDoc.getElementsByTagName('coordinates')[0].innerHTML = pointsStr;

        //console.log(xmlDoc);

        var oSerializer = new XMLSerializer();
        var sXML = oSerializer.serializeToString(xmlDoc);

        funDownload(sXML, fname+'.kml');
    }

    var GPS = {
        PI : 3.14159265358979324,
        x_pi : 3.14159265358979324 * 3000.0 / 180.0,
        delta : function (lat, lon) {
            // Krasovsky 1940
            //
            // a = 6378245.0, 1/f = 298.3
            // b = a * (1 - f)
            // ee = (a^2 - b^2) / a^2;
            var a = 6378245.0; //  a: 卫星椭球坐标投影到平面地图坐标系的投影因子。
            var ee = 0.00669342162296594323; //  ee: 椭球的偏心率。
            var dLat = this.transformLat(lon - 105.0, lat - 35.0);
            var dLon = this.transformLon(lon - 105.0, lat - 35.0);
            var radLat = lat / 180.0 * this.PI;
            var magic = Math.sin(radLat);
            magic = 1 - ee * magic * magic;
            var sqrtMagic = Math.sqrt(magic);
            dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI);
            dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI);
            return {'lat': dLat, 'lon': dLon};
        },

        //WGS-84 to GCJ-02
        gcj_encrypt : function (wgsLat, wgsLon) {
            if (this.outOfChina(wgsLat, wgsLon))
                return {'lat': wgsLat, 'lon': wgsLon};

            var d = this.delta(wgsLat, wgsLon);
            return {'lat' : wgsLat + d.lat,'lon' : wgsLon + d.lon};
        },
        //GCJ-02 to WGS-84
        gcj_decrypt : function (gcjLat, gcjLon) {
            if (this.outOfChina(gcjLat, gcjLon))
                return {'lat': gcjLat, 'lon': gcjLon};

            var d = this.delta(gcjLat, gcjLon);
            return {'lat': gcjLat - d.lat, 'lon': gcjLon - d.lon};
        },
        //GCJ-02 to WGS-84 exactly
        gcj_decrypt_exact : function (gcjLat, gcjLon) {
            var initDelta = 0.01;
            var threshold = 0.000000001;
            var dLat = initDelta, dLon = initDelta;
            var mLat = gcjLat - dLat, mLon = gcjLon - dLon;
            var pLat = gcjLat + dLat, pLon = gcjLon + dLon;
            var wgsLat, wgsLon, i = 0;
            while (1) {
                wgsLat = (mLat + pLat) / 2;
                wgsLon = (mLon + pLon) / 2;
                var tmp = this.gcj_encrypt(wgsLat, wgsLon)
                dLat = tmp.lat - gcjLat;
                dLon = tmp.lon - gcjLon;
                if ((Math.abs(dLat) < threshold) && (Math.abs(dLon) < threshold))
                    break;

                if (dLat > 0) pLat = wgsLat; else mLat = wgsLat;
                if (dLon > 0) pLon = wgsLon; else mLon = wgsLon;

                if (++i > 10000) break;
            }
            //console.log(i);
            return {'lat': wgsLat, 'lon': wgsLon};
        },
        //GCJ-02 to BD-09
        bd_encrypt : function (gcjLat, gcjLon) {
            var x = gcjLon, y = gcjLat;
            var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * this.x_pi);
            var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * this.x_pi);
            bdLon = z * Math.cos(theta) + 0.0065;
            bdLat = z * Math.sin(theta) + 0.006;
            return {'lat' : bdLat,'lon' : bdLon};
        },
        //BD-09 to GCJ-02
        bd_decrypt : function (bdLat, bdLon) {
            var x = bdLon - 0.0065, y = bdLat - 0.006;
            var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi);
            var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * this.x_pi);
            var gcjLon = z * Math.cos(theta);
            var gcjLat = z * Math.sin(theta);
            return {'lat' : gcjLat, 'lon' : gcjLon};
        },
        //WGS-84 to Web mercator
        //mercatorLat -> y mercatorLon -> x
        mercator_encrypt : function(wgsLat, wgsLon) {
            var x = wgsLon * 20037508.34 / 180.;
            var y = Math.log(Math.tan((90. + wgsLat) * this.PI / 360.)) / (this.PI / 180.);
            y = y * 20037508.34 / 180.;
            return {'lat' : y, 'lon' : x};
            /*
            if ((Math.abs(wgsLon) > 180 || Math.abs(wgsLat) > 90))
                return null;
            var x = 6378137.0 * wgsLon * 0.017453292519943295;
            var a = wgsLat * 0.017453292519943295;
            var y = 3189068.5 * Math.log((1.0 + Math.sin(a)) / (1.0 - Math.sin(a)));
            return {'lat' : y, 'lon' : x};
            //*/
        },
        // Web mercator to WGS-84
        // mercatorLat -> y mercatorLon -> x
        mercator_decrypt : function(mercatorLat, mercatorLon) {
            var x = mercatorLon / 20037508.34 * 180.;
            var y = mercatorLat / 20037508.34 * 180.;
            y = 180 / this.PI * (2 * Math.atan(Math.exp(y * this.PI / 180.)) - this.PI / 2);
            return {'lat' : y, 'lon' : x};
            /*
            if (Math.abs(mercatorLon) < 180 && Math.abs(mercatorLat) < 90)
                return null;
            if ((Math.abs(mercatorLon) > 20037508.3427892) || (Math.abs(mercatorLat) > 20037508.3427892))
                return null;
            var a = mercatorLon / 6378137.0 * 57.295779513082323;
            var x = a - (Math.floor(((a + 180.0) / 360.0)) * 360.0);
            var y = (1.5707963267948966 - (2.0 * Math.atan(Math.exp((-1.0 * mercatorLat) / 6378137.0)))) * 57.295779513082323;
            return {'lat' : y, 'lon' : x};
            //*/
        },
        // two point's distance
        distance : function (latA, lonA, latB, lonB) {
            var earthR = 6371000.;
            var x = Math.cos(latA * this.PI / 180.) * Math.cos(latB * this.PI / 180.) * Math.cos((lonA - lonB) * this.PI / 180);
            var y = Math.sin(latA * this.PI / 180.) * Math.sin(latB * this.PI / 180.);
            var s = x + y;
            if (s > 1) s = 1;
            if (s < -1) s = -1;
            var alpha = Math.acos(s);
            var distance = alpha * earthR;
            return distance;
        },
        outOfChina : function (lat, lon) {
            if (lon < 72.004 || lon > 137.8347)
                return true;
            if (lat < 0.8293 || lat > 55.8271)
                return true;
            return false;
        },
        transformLat : function (x, y) {
            var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x));
            ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0;
            ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0;
            ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0;
            return ret;
        },
        transformLon : function (x, y) {
            var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x));
            ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0;
            ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0;
            ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0;
            return ret;
        }
    };

    // 下载字符串文件 //content是字符串，filename是下载的文件名
    var funDownload = function (content, filename) {
        // 创建隐藏的可下载链接
        var eleLink = document.createElement('a');
        eleLink.download = filename;
        eleLink.style.display = 'none';
        // 字符内容转变成blob地址
        var blob = new Blob([content]);
        eleLink.href = URL.createObjectURL(blob);
        // 触发点击
        document.body.appendChild(eleLink);
        eleLink.click();
        // 然后移除
        document.body.removeChild(eleLink);
    };


    var menu=new ContextMenu(map);
    function ContextMenu(map) {
        var me = this;
        this.mouseTool = new AMap.MouseTool(map); //地图中添加鼠标工具MouseTool插件
        this.contextMenuPositon = null;
        var content = [];
        content.push("<div>");
        content.push("    <ul class='context_menu'>");
        content.push("        <li onclick='menu.setStartPoint()'>起点</li>");
        content.push("        <li onclick='menu.setEndPoint()'>终点</li>");
        content.push("    </ul>");
        content.push("</div>");
        this.contextMenu = new AMap.ContextMenu({isCustom: true, content: content.join('')});//通过content自定义右键菜单内容
        //地图绑定鼠标右击事件——弹出右键菜单
        map.on('rightclick', function(e) {
            me.contextMenu.open(map, e.lnglat);
            me.contextMenuPositon = e.lnglat; //右键菜单位置
        });
    }

    ContextMenu.prototype.setStartPoint=function () {  //右键菜单添加起点标记
        this.mouseTool.close();
        marker_start.setPosition(this.contextMenuPositon);
        this.contextMenu.close();
        drawNavi();
    }

    ContextMenu.prototype.setEndPoint=function () {  //右键菜单添加终点标记
        this.mouseTool.close();
        marker_end.setPosition(this.contextMenuPositon);
        this.contextMenu.close();
        drawNavi();
    }

    function getAddr(pos,target){
        var geocoder = new AMap.Geocoder({
            radius: 1000,
            extensions: "all"
        });
        geocoder.getAddress(pos, function(status, result) {
            if (status === 'complete' && result.info === 'OK') {
                var address = result.regeocode.formattedAddress; //返回地址描述
                document.getElementById(target).innerHTML = address.replace('广西壮族自治区','');
            }
        });
    }


    //输入提示
    var autoOptions = {
        input: "tipinput"
    };
    var auto = new AMap.Autocomplete(autoOptions);
    var placeSearch = new AMap.PlaceSearch({
        map: map
    });  //构造地点查询类
    AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
    function select(e) {
        placeSearch.setCity(e.poi.adcode);
        placeSearch.search(e.poi.name);  //关键字查询查询
    }

</script>



</body>
</html>